<template lang="pug">
  header
    a(v-for="lang in langs" :key="lang" @click="go(lang)") | {{genLang(lang)}}
    nuxt-link(:to="$i18n.path('secret')" exact) | {{ $t('links.secret') }}
    nuxt-link(:to="$i18n.path('about')" exact) | {{ $t('links.about') }}
    nuxt-link(
      v-show="!$store.state.authUser"
      :to="$i18n.path('sign')" exact
      ) | {{ $t('links.sign') }}
    a(v-show="$store.state.authUser"
      href="javascript:void(0);"
      @click="signout"
      ) | {{$t('sign.signout')}}
</template>

<script>
export default {
  name: 'Header',
  components: {
  },

  props: {
  },

  data () {
    return {
    }
  },

  computed: {
    langs () { return Object.keys(this.$i18n.messages) }
  },

  methods: {
    genLang (lang) {
      return this.$i18n.messages[lang].site.lang
    },
    go (lang) {
      let path = ''
      let fallback = this.$i18n.fallbackLocale
      let locale = this.$i18n.locale
      let fullpath = this.$route.fullPath
      if (lang !== fallback) {
        if (lang === locale) { return }
        path = `/${lang}${fullpath}`
      } else {
        path = fullpath.replace(/^\/[^/]+/, '')
      }
      window.location.href = path
    },
    async signout() {
      try {
        await this.$store.dispatch('signout')
        this.$router.push(this.$i18n.path(''))
      } catch (e) {
        this.formError = e.message
      }
    }
  },

  mounted () {
  }
}
</script>

<style>
</style>
